<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <!-- <link rel="icon" href="https://static.jianshukeji.com/hcode/images/favicon.ico"> -->
  <style>
    /* css 代码  */
    #container {
      width: 500px;
      height: 400px;
    }
  </style>

</head>

<body>
  <div id="container"></div>
  <script src="https://code.hcharts.cn/highcharts/highcharts.js"></script>
  <script src="https://code.hcharts.cn/highcharts/highcharts-3d.js"></script>
  <script src="https://code.hcharts.cn/highcharts/modules/cylinder.js"></script>
  <script src="https://code.hcharts.cn/highcharts/modules/funnel3d.js"></script>
  <script src="https://code.hcharts.cn/highstock/modules/pyramid3d.js"></script>
  <script>
    // JS 代码 
    // Set up the chart

    Highcharts.chart('container', {
      credits: {
        enabled: false // 去掉右下角的highcharts.com
      },
      chart: {
        type: 'pyramid3d',
        options3d: {
          enabled: true,
          alpha: 10,
          depth: 50,
          viewDistance: 50
        }
      },
      title: {
        text: '',
      },
      plotOptions: {
        series: {
          dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b> ({point.y:,.0f})',
            color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
            allowOverlap: true,
            x: 10,
            y: -5
          },
          width: '60%',
          height: '80%',
          center: ['50%', '45%']
        }
      },
      series: [{
        name: 'Unique users',
        data: [
          ['风电', 654],
          ['Downloads', 2064],
          ['Requested price list', 1987],
          ['Invoice sent', 976],
          ['Finalized', 846]
        ]
      }]
    });

  </script>
</body>

</html>